<!DOCTYPE html>
<html lang="UTF-8" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="keys" content="">
    <meta name="author" content="">
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/css/font-awesome.min.css}">
    <link rel="stylesheet" th:href="@{/css/login.css}">
    <style>

    </style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <div class="container">
        <div class="navbar-header">
            <div><a class="navbar-brand" href="index.html" style="font-size:32px;">尚筹网-创意产品众筹平台</a></div>
        </div>
    </div>
</nav>

<div class="container">

    <form class="form-signin" role="form" action="">
        <h2 class="form-signin-heading" ><i class="glyphicon glyphicon-user"></i> 用户登录</h2>
        <div class="form-group has-success has-feedback">
            <input type="text" class="form-control" id="username" placeholder="请输入登录账号" autofocus name="userName">
            <span class="glyphicon glyphicon-user form-control-feedback"></span>
        </div>
        <div class="form-group has-success has-feedback">
            <input type="text" class="form-control" id="password" placeholder="请输入登录密码" style="margin-top:10px;" name="pwd">
            <span class="glyphicon glyphicon-lock form-control-feedback"></span>
        </div>
        <div class="form-group has-success has-feedback">
            <select class="form-control">
                <option value="member">会员</option>
                <option value="user">管理</option>
            </select>
        </div>
        <div class="checkbox">
            <label>
                <input type="checkbox" value="remember-me"> 记住我
            </label>
            <br>
            <label>
                忘记密码
            </label>
            <label style="float:right">
                <a href="reg.html">我要注册</a>
            </label>
        </div>
        <a class="btn btn-lg btn-success btn-block" onclick="dologin()"> 登录</a>
    </form>
</div>
<script th:src="@{/jquery/jquery-2.1.1.min.js}"></script>
<script th:src="@{/bootstrap/js/bootstrap.min.js}"></script>
<script th:src="@{/layer/layer.js}" type="text/javascript" ></script>
<script th:inline="javascript">
    var ctxPath = [[${application.ctxPath}]];
    console.log(ctxPath);
    console.log([[${param.ctxPath}]]);
    console.log([[${session.ctxPath}]]);
    console.log([[${application.ctxPath}]]);
    function dologin() {
        var username = $("#username").val();
        var password = $("#password").val();
        if(username == ""){
            layer.msg("用户登录账号不能为空，请输入", {time:2000, icon:5, shift:6}, function(){});
            return false;
        }
        if(password == ""){
            layer.msg("用户登录密码不能为空，请输入", {time:2000, icon:5, shift:6}, function(){});
            return false;
        }
        console.log(JSON.stringify({account: username, pwd: password}));
        $.ajax({
            url: ctxPath + "/doLogin",
            type: "post",
            contentType: "application/json;charset=utf-8",
            data: JSON.stringify({account: username, pwd: password}) ,
            success: function(data){
                console.log(data);
                window.location.href = ctxPath + "/main";
            },
            error: function(xhr, status, error){
                console.log(xhr.responseJSON);
                layer.msg(xhr.responseJSON.msg, {time:2000, icon:5, shift:6}, function(){});
            }
        })
        return true;
    }
</script>
</body>
</html>